<template>
    <div class="tip">
        <!--      常见科室的结构-->
        <div class="department">
            <div class="header">
                <div class="left">
                    <svg t="1688630576947" class="icon" viewBox="0 0 1024 1024" version="1.1"
                         xmlns="http://www.w3.org/2000/svg" p-id="2522" id="mx_n_1688630576948" width="16" height="16">
                        <path d="M817.3 305.3H762V250c0-61.1-49.5-110.7-110.7-110.7H374.7C313.5 139.3 264 188.8 264 250v55.3h-55.3C147.5 305.3 98 354.8 98 416v359.7c0 61.1 49.5 110.7 110.7 110.7h608.7c61.1 0 110.7-49.5 110.7-110.7V416c-0.1-61.2-49.6-110.7-110.8-110.7z m-498-55.3c0-30.5 24.8-55.3 55.3-55.3h276.7c30.5 0 55.3 24.8 55.3 55.3v55.3H319.3V250z m553.4 525.6c0 30.5-24.8 55.3-55.3 55.3H208.7c-30.5 0-55.3-24.8-55.3-55.3V416c0-30.5 24.8-55.3 55.3-55.3H817.3c30.5 0 55.3 24.8 55.3 55.3v359.6z"
                              p-id="2523" fill="#600f0f"></path>
                        <path d="M540.7 471.3h-55.4V582H374.7v55.3h110.6V748h55.4V637.3h110.6V582H540.7z" p-id="2524"
                              fill="#600f0f"></path>
                    </svg>
                    <span>常见科室</span>
                </div>
                <div class="right">
                    <span>全部</span>
                    <svg t="1688630645205" class="icon" viewBox="0 0 1024 1024" version="1.1"
                         xmlns="http://www.w3.org/2000/svg" p-id="4369" width="16" height="16">
                        <path d="M761.6 489.6l-432-435.2c-9.6-9.6-25.6-9.6-35.2 0-9.6 9.6-9.6 25.6 0 35.2l416 416-416 425.6c-9.6 9.6-9.6 25.6 0 35.2s25.6 9.6 35.2 0l432-441.6C771.2 515.2 771.2 499.2 761.6 489.6z"
                              p-id="4370"></path>
                    </svg>
                </div>
            </div>
            <div class="content">
                <ul>
                    <li>神经内科</li>
                    <li>消化内科</li>
                    <li>呼吸内科</li>
                    <li>内科</li>
                    <li>儿科</li>
                    <li>妇科</li>
                    <li>神经外科</li>
                    <li>产科</li>
                </ul>
            </div>
        </div>

        <!--     平台公告   -->
        <div class="notice">
            <div class="header">
                <div class="left">
                    <svg t="1688632726761" class="icon" viewBox="0 0 1024 1024" version="1.1"
                         xmlns="http://www.w3.org/2000/svg" p-id="2314" width="16" height="16">
                        <path d="M768.554667 824.490667v64H258.666667v-64h509.888zM906.666667 181.333333v533.333334h-789.333334v-533.333334h789.333334z m-64 64h-661.333334v405.333334h661.333334v-405.333334z m-115.712 237.824v64h-426.666667v-64h426.666667z m0-149.333333v64h-426.666667v-64h426.666667z"
                              fill="#d81e06" p-id="2315"></path>
                    </svg>
                    <span>平台公告</span>
                </div>
                <div class="right">
                    <span>全部</span>
                    <svg t="1688630645205" class="icon" viewBox="0 0 1024 1024" version="1.1"
                         xmlns="http://www.w3.org/2000/svg" p-id="4369" width="16" height="16">
                        <path d="M761.6 489.6l-432-435.2c-9.6-9.6-25.6-9.6-35.2 0-9.6 9.6-9.6 25.6 0 35.2l416 416-416 425.6c-9.6 9.6-9.6 25.6 0 35.2s25.6 9.6 35.2 0l432-441.6C771.2 515.2 771.2 499.2 761.6 489.6z"
                              p-id="4370"></path>
                    </svg>
                </div>
            </div>
            <div class="content">
                <ul>
                    <li>关于延长北京国际医院放假的通知</li>
                    <li>北京中医院大学东方医院部分科室医生门诊信息</li>
                    <li>武警总医院号源暂停更新通知</li>
                </ul>
            </div>
        </div>

        <!--       停诊公告 -->
        <div class="notice">
            <div class="header">
                <div class="left">
                    <svg t="1688634518731" class="icon" viewBox="0 0 1024 1024" version="1.1"
                         xmlns="http://www.w3.org/2000/svg" p-id="2561" width="16" height="16">
                        <path d="M736 768h-448a32 32 0 0 1 0-64h448a32 32 0 0 1 0 64z m-44.8-415.552l-147.669333-147.669333a61.994667 61.994667 0 0 1-62.848 0l-147.669334 147.669333a32.554667 32.554667 0 0 1-46.037333-46.037333l161.578667-161.578667a63.68 63.68 0 0 1 127.104 0l161.578666 161.578667a32.554667 32.554667 0 0 1-46.037333 46.037333zM565.333333 512a32 32 0 0 1 0 64h-277.333333a32 32 0 0 1 0-64h277.333333z"
                              fill="#EB9E52" p-id="2562"></path>
                        <path d="M853.333333 981.333333H170.666667a85.333333 85.333333 0 0 1-85.333334-85.333333V384a85.333333 85.333333 0 0 1 85.333334-85.333333h682.666666a85.333333 85.333333 0 0 1 85.333334 85.333333v512a85.333333 85.333333 0 0 1-85.333334 85.333333z m21.333334-576a42.666667 42.666667 0 0 0-42.666667-42.666666H192a42.666667 42.666667 0 0 0-42.666667 42.666666v469.333334a42.666667 42.666667 0 0 0 42.666667 42.666666h640a42.666667 42.666667 0 0 0 42.666667-42.666666V405.333333z"
                              fill="#5C8EF3" p-id="2563"></path>
                    </svg>
                    <span>停诊公告</span>
                </div>
                <div class="right">
                    <span>全部</span>
                    <svg t="1688630645205" class="icon" viewBox="0 0 1024 1024" version="1.1"
                         xmlns="http://www.w3.org/2000/svg" p-id="4369" width="16" height="16">
                        <path d="M761.6 489.6l-432-435.2c-9.6-9.6-25.6-9.6-35.2 0-9.6 9.6-9.6 25.6 0 35.2l416 416-416 425.6c-9.6 9.6-9.6 25.6 0 35.2s25.6 9.6 35.2 0l432-441.6C771.2 515.2 771.2 499.2 761.6 489.6z"
                              p-id="4370"></path>
                    </svg>
                </div>
            </div>
            <div class="content">
                <ul>
                    <li>中国人民解放军总医院第六医学中心(原海军总医院)呼吸内科门诊停诊公告</li>
                    <li>首都医科大学附属北京三环老年医学科门诊停诊公告</li>
                    <li>武警总医院门诊停诊公告</li>
                </ul>
            </div>
        </div>

    </div>


</template>

<script setup lang="ts">

</script>


<style scoped lang="scss">

.tip {
  color: #7f7f7f;

  .department {
    .header {
      display: flex;
      justify-content: space-between;

      .left {
        display: flex;
        align-items: center;

        span {
          margin-left: 5px;
        }
      }

      .right {
        display: flex;
        align-items: center;

        span {
          margin-right: 2px;
        }
      }
    }

    .content {
      margin-left: -30px;

      ul {
        list-style: none;
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;

        li {
          width: 45%;
          margin-top: 10px;
        }
      }

    }
  }

  .notice {
    margin-top: 20px;

    .header {
      display: flex;
      justify-content: space-between;

      .left {
        display: flex;
        align-items: center;

        span {
          margin-left: 5px;
        }
      }

      .right {
        display: flex;
        align-items: center;

        span {
          margin-right: 2px;
        }
      }
    }

    .content {
      margin-left: -30px;

      ul {
        display: flex;
        flex-wrap: wrap;

        li {
          width: 100%;
          white-space: nowrap;
          text-overflow: ellipsis;
          overflow: hidden;
          margin-top: 20px;
        }
      }

    }
  }


}
</style>